<template>
  <div>
    <div class="top">
      <van-icon class="zuo" name="arrow-left" />
      列表
    </div>
    <van-tree-select
      height="100%"
      :items="items"
      :main-active-index.sync="active"
    >
      <template #content>
        <van-grid square column-num="2">
          <van-grid-item  icon="photo-o" text="文字" />
        </van-grid>
      </template>
    </van-tree-select>
    <FooterBarVue></FooterBarVue>
  </div>
</template>

<script>
import FooterBarVue from "../components/FooterBar.vue";

export default {
  components: {
    // HomeVue
    FooterBarVue,
  },
  data() {
    return {
      active: 0,
      items: [],
    };
  },
  created() {
    this.$server({
      url: "pro/categorylist",
    }).then((res) => {
      let arr = res.data.data;
      let obj = {};
      console.log(arr);
      for (const key in arr) {
        obj[key] = arr[key];
      }
      let newobj = Object.keys(obj).map((item) => ({ text: obj[item] }));
      this.items = newobj;
    });
  },
mathods:{
  goList(){
     
  }
}
};
</script>

<style scoped>
.top {
  width: 100%;
  height: 3.75rem;
  font-size: 1.25rem;
  text-align: center;
  line-height: 3.75rem;
  border-bottom: 0.0625rem solid black;
  position: relative;
}
.zuo {
  position: absolute;
  left: 0.625rem;
  font-size: 1.25rem;
  top: 1.375rem;
}
</style>